<template>
    <el-form
            label-position="left"
            label-width="120px"
            ref="dialogRef"
    >
        <!-- 循环开始  -->
        <template v-for="(item,i) in rows">
            <!--
            判断循环中的元素是否需要下拉框
            :rules="item.rule"  循环中的数据 自定义的 rule 规则
            :prop="`getAllTableData.${i}.value`"
            每次循环的时候进行取值, 相当于给每个form绑定了唯一的model
            -->
            <el-form-item
                    v-if="item.selectFlag"
                    :key="item.labelName"
                    :label="item.labelName"
                    :prop="`getAllTableData.${i}.value`"
                    :rules="item.rule"
                    class="selectInput-box"
            >
<!--                <el-select v-model="item.value" placeholder="请选择">-->
<!--                    <el-option-->
<!--                            v-for="(item1) in item.selectOption"-->
<!--                            :key="item1.value"-->
<!--                            :label="item1.label"-->
<!--                            :value="item1.value"-->
<!--                    ></el-option>-->
<!--                </el-select>-->
            </el-form-item>
            <el-form-item
                    v-else-if="!item.hidden && item.disabled"
                    :key="item.labelName"
                    :prop="`getAllTableData.${i}.value`"
                    :rules="item.rule"
                    :label="item.labelName"
            >
                <el-input
                        v-model="item.value"
                        clearable
                        autocomplete="off"
                        :disabled="true"
                ></el-input>
            </el-form-item>
            <el-form-item
                    v-else-if="!item.hidden"
                    :key="i"
                    :prop="`getAllTableData.${i}.value`"
                    :rules="item.rule"
                    :label="item.labelName"
            >
                <el-input v-model="item.value" clearable autocomplete="off"></el-input>
            </el-form-item>
        </template>
    </el-form>
</template>

<script>
    export default {
        name: "Form",
        props:{
            rows:{
                type: Array,
                defalt: []
            }
        }
    }
</script>

<style scoped>

</style>
